<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>服务器备份服务</title>
  <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
  <style>
	body {
	    -webkit-user-select: none;
	    -moz-user-select: none;
	    -ms-user-select: none;
	    user-select: none;
	    padding: 15px;
	}
  </style>
</head>

<body>
	<table id="backup-table" lay-filter="backup-table"></table>
	<script type="text/html" id="backup-toolbar">
		<button class="layui-btn layui-btn-normal layui-btn-sm layui-btn-radius" lay-event="edit">
			<i class="layui-icon layui-icon-add-1"></i>
		</button>
		<button class="layui-btn layui-btn-danger layui-btn-sm layui-btn-radius" lay-event="setups">
			<i class="layui-icon layui-icon-set-fill"></i>
		</button>
	</script>
	<script type="text/html" id="backup-bar">
		<button class="layui-btn layui-btn-normal layui-btn-sm layui-btn-radius" lay-event="edit"><i class="layui-icon layui-icon-edit"></i></button>
		<button class="layui-btn layui-btn-danger layui-btn-sm layui-btn-radius" lay-event="remove"><i class="layui-icon layui-icon-delete"></i></button>
        <button class="layui-btn layui-btn-sm layui-btn-radius" lay-event="start"><i class="layui-icon layui-icon-play"></i></button>
	</script>
</body>
<script th:src="@{/layui/layui.js}"></script>
<script>
    layui.use(['table', 'form', 'jquery'], function () {
        let table = layui.table;
        let form = layui.form;
        let $ = layui.jquery;

        let prefix = "/backup/";

        let cols = [
        	[
        		{ type: 'numbers', title: '序号', width: 80, fixed: 'center' },
                { field: 'name', title: '名称', align: 'center' },
                { field: 'backupTime', title: '备份时间', align: 'center' },
                { field: 'dirPath', title: '存储磁盘地址', align: 'center' },
                { field: 'serverHost', title: '服务器地址', align: 'center' },
                { field: 'backupName', title: '备份文件名称', align: 'center' },
                {title: '操作', toolbar: '#backup-bar', align: 'center', width: 180}
            ]
        ]

        table.render({
            elem: '#backup-table',
            url: prefix + 'data',
            page: {
                layout: ['prev','page','next','count'], 
                groups: 3, 
                theme:'#1e9fff'
            },
            cols: cols,
            skin: 'line',
            toolbar: '#backup-toolbar',
            defaultToolbar: [{
                layEvent: 'refresh',
                icon: 'layui-icon-refresh',
            }]
        });

        table.on('tool(backup-table)', function (obj) {
            if (obj.event === 'start') {
                window.start(obj);
            } else if (obj.event === 'remove') {
                window.remove(obj);
            } else if (obj.event === 'edit') {
                window.edit(obj);
            } else if (obj.event === 'editPassword') {
                window.editPassword(obj);
            }
        });

        table.on('toolbar(backup-table)', function (obj) {
            if (obj.event === 'edit') {
                window.edit();
            } else if (obj.event === 'refresh') {
                window.refresh();
            } else if (obj.event === 'setups') {
                window.setups(obj);
            }
        });

        window.edit = function (obj) {
        	let url = prefix + 'edit';
        	if(obj){
        		url += '?id='+obj.data['id'];
        	}
            layer.open({
                type: 2,
                title: '服务备份信息',
                shade: 0.1,
                area: ['655px', '500px'],
                content: url
            });
        }
        
        window.setups = function (obj) {
        	let url = '/setups/edit';
            layer.open({
                type: 2,
                title: '服务配置信息',
                shade: 0.1,
                area: ['450px', '430px'],
                content: url
            });
        }

        window.remove = function (obj) {
            layer.confirm('确定要删除该服务器备份？', {icon: 3, title: '提示'}, function (index) {
                layer.close(index);
                let loading = layer.load();
                $.ajax({
                    url: prefix + "delete" + obj.data['id'],
                    dataType: 'json',
                    type: 'delete',
                    success: function (result) {
                        layer.close(loading);
                        if (result.success) {
                            layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                            	window.refresh();
                                obj.del();
                            });
                        } else {
                            layer.msg(result.msg, {icon: 2, time: 1000});
                        }
                    }
                })
            });
        }

        window.start = function (obj) {
            layer.confirm('确定要立即执行备份任务？', {icon: 3, title: '提示'}, function (index) {
                layer.close(index);
                let loading = layer.load();
                $.ajax({
                    url: prefix + "startBackUp"  + '?id='+obj.data['id'],
                    dataType: 'json',
                    type: 'get',
                    success: function (result) {
                        layer.close(loading);
                        if (result.success) {
                            layer.msg(result.msg, {icon: 1, time: 1000});
                        } else {
                            layer.msg(result.msg, {icon: 2, time: 1000});
                        }
                    }
                })
            });
        }

        window.refresh = function (param) {
            table.reload('backup-table', {where: param});
        }
    })
</script>

</html>